<template>
    <div class="nav-footer" v-if="show === 'true'" id="footer">
        <div :class="{ 'active': index=='home'}" @click="toPage('home')">
            <span class="iconfont item-logo text1-size mui-text-middle">&#xe608;</span>
            <span class="text2-size mui-text-middle mui-tab-label">首页</span>
        </div>
        <div :class="{ 'active': index=='promos'}" @click="toPage('promo/list')">
            <span class="iconfont item-logo text1-size mui-text-middle">&#xe607;</span>
            <span class="text2-size mui-text-middle mui-tab-label">发现</span>
        </div>
        <div  :class="{ 'active': index=='customerServiceList'}" @click="toPage('customerService/list')">
            <span class="iconfont item-logo text1-size  mui-text-middle">&#xe600;</span>
            <span class="text2-size  mui-text-middle mui-tab-label">咨询</span>
        </div>
        <div  v-if="enterpriseFlag === false" :class="{ 'active': index=='ucenterHome'}" @click="toPage('ucenter/home')">
            <span class="iconfont item-logo text1-size  mui-text-middle">&#xe601;</span>
            <span class="text2-size mui-text-middle mui-tab-label">我的</span>
        </div>
        <div v-if="enterpriseFlag === true" :class="{ 'active': index=='ucenterHome'}" @click="toPage('enterprise/home')">
            <span class="iconfont  wode text1-size">&#xe601;</span>
            <span class="text2-size  mui-tab-label">我的</span>
        </div>
    </div>
</template>
<style>
    .nav-footer{bottom: 0; display: table; width: 100%; height: 1rem; padding: 0; table-layout: fixed; z-index: 1000;}
    .nav-footer>div{ display: table-cell;  overflow: hidden;  width: 1%; height: 1rem; text-align: center; vertical-align: middle; white-space: nowrap; text-overflow: ellipsis; color: #8f8f94;}
</style>
<script>
    export default{
        vuex:{
            getters:{
                enterpriseFlag:function(state){
                    return state.enterpriseFlag;
                },
                mycar:function(state){
                    return state.mycar;
                },
                profile:function(state) {
                    return state.profile;
                }
            }
        },
        data(){
            return{
                msg:'footer-nav',
            }
        },
        ready () {
        },
        //props:['index'],
        props:{
            index:{
                required: true
            },
            show:{
                default:'true'
            }
        },
        methods:{
            toPage(str){
                let that=this;
                that.$router.go('/'+str);
            }
        },
        components:{

        }
    }
</script>
